import {useLocation, useNavigate, useOutletContext} from "react-router-dom"
import {useEffect} from "react"
import {Result} from "antd"

function PayResult() {
    const [setTitle, setBack] = useOutletContext()
    useEffect(() => {
        setTitle('支付成功')
        setBack('/mall/home')
    }, [setBack, setTitle])
    const navigate = useNavigate()
    const {orderId} = useLocation().state

    function toOrderDetail() {
        navigate('/purchase/order-detail', { state: {orderId}})
    }

    function backToHome() {
        navigate('/mall/home')
    }

    return (
        <>
            <Result status="success" title="支付成功"/>
            <div className="big-btn" onClick={toOrderDetail}>查看订单</div>
            <div className="big-btn white" onClick={backToHome}>返回首页</div>
        </>
    )
}

export default PayResult